<template>
  <a-form style="width:100%;" :form="form" layout="horizontal" :label-col="{ span: 6 }" :wrapper-col="{ span: 14 }">
    <a-form-item label="组织机构代码证信息">
      <a-input
        v-decorator="['licenseNo', { rules: [{ required: true, message: '请输入统一社会信用代码证号' }] }]"
        :disabled="!canFix"
        placeholder="请输入统一社会信用代码证号"
      />
    </a-form-item>
    <a-form-item label="有效期开始">
      <a-date-picker
        v-decorator="['licenseStartDate', { rules: [{ required: true, message: '请选择有效期开始' }] }]"
        :disabled="!canFix"
        :ranges="{ 长期: [new Date(), new Date(9999, 11, 31)] }"
      />
    </a-form-item>
    <a-form-item label="有效期结束">
      <DatePickerWithFooter
        :form="form"
        :disabled="!canFix"
        :decoratorOptions="['licenseEndDate', { rules: [{ required: true, message: '请选择有效期结束' }] }]"
      />
      <!-- <a-date-picker
        v-decorator="['licenseEndDate', { rules: [{ required: true, message: '请选择有效期结束' }] }]" :disabled="!canFix"
        :ranges="{ 长期: [new Date(), new Date(9999, 11, 31)] }"
      /> -->
    </a-form-item>
    <a-form-item label="上传附件">
      <j-upload v-decorator="['licensePath', { rules: [{ required: true }] }]" :disabled="!canFix"></j-upload>
      <!--      <a-upload accept=".jpg, .jpeg, .gif, .png, .bmp, .JPG, .JPEG, .GIF, .PNG, .BMP" @change="e => handleUpload(e)">
        <a-button type="primary">上传附件</a-button>
      </a-upload>-->
    </a-form-item>
    <a-divider />
    <template v-if="user.bidderCodeType.includes('施工单位')">
      <a-form-item label="安全生产许可证号">
        <a-input
          v-decorator="['safeProductionNo', { rules: [{ required: true, message: '请输入' }] }]"
          :disabled="!canFix"
          placeholder="请输入"
        />
      </a-form-item>
      <a-form-item label="有效期开始">
        <a-date-picker
          v-decorator="['safeProductionStart', { rules: [{ required: true, message: '请选择有效期开始' }] }]"
          :disabled="!canFix"
          :ranges="{ 长期: [new Date(), new Date(9999, 11, 31)] }"
        />
      </a-form-item>
      <a-form-item label="有效期结束">
        <DatePickerWithFooter
          :form="form"
          :disabled="!canFix"
          :decoratorOptions="['safeProductionEnd', { rules: [{ required: true, message: '请选择有效期结束' }] }]"
        />
      </a-form-item>
      <a-form-item label="安全生产许可证图片">
        <j-upload v-decorator="['safeProductionPath', { rules: [{ required: true }] }]" :disabled="!canFix"></j-upload>
        <!--      <a-upload accept=".jpg, .jpeg, .gif, .png, .bmp, .JPG, .JPEG, .GIF, .PNG, .BMP" @change="e => handleUpload(e)">
        <a-button type="primary">上传附件</a-button>
      </a-upload>-->
      </a-form-item>
      <a-divider
    /></template>
    <a-form-item label="社保登记信息">
      <a-input
        v-decorator="['socialSecurityNo', { rules: [{ required: true, message: '请输入社保登记号' }] }]"
        :disabled="!canFix"
        placeholder="请输入社保登记号"
      />
    </a-form-item>
    <a-form-item label="有效期开始">
      <a-date-picker
        v-decorator="['socialSecurityStart', { rules: [{ required: true, message: '请选择有效期开始' }] }]"
        :disabled="!canFix"
        :ranges="{ 长期: [new Date(), new Date(9999, 11, 31)] }"
      />
    </a-form-item>
    <a-form-item label="有效期结束">
      <a-date-picker
        v-decorator="['socialSecurityEnd', { rules: [{ required: true, message: '请选择有效期结束' }] }]"
        :disabled="!canFix"
      >
        <template slot="renderExtraFooter">
          <a-button
            type="link"
            @click="form.setFieldsValue({ socialSecurityRegistrationEndDate: moment('9999-12-31') })"
            >长期</a-button
          >
        </template></a-date-picker
      >
    </a-form-item>
    <a-form-item label="上传附件">
      <j-upload v-decorator="['socialSecurityPath', { rules: [{ required: true }] }]" :disabled="!canFix"></j-upload>
    </a-form-item>
    <a-divider />
    <!--    <a-form-item label="缴费信息">
      <a-input
        v-decorator=" :disabled="!canFix"[
          'registrationCapitalBankDepositProof',
          { rules: [{ required: true, message: '请输入注册资本银行缴款证明' }] }
        ]"
        placeholder="请输入注册资本银行缴款证明"
      />
    </a-form-item>-->
    <a-form-item label="注册资本银行缴款证明附件">
      <j-upload
        v-decorator="['regCertificate', { rules: [{ required: true, message: '请上传附件' }] }]"
        :disabled="!canFix"
      ></j-upload>
    </a-form-item>
  </a-form>
</template>

<script>
import { Form, Input, DatePicker, Upload, Button } from 'ant-design-vue'
import { axios } from '@/utils/request'
import moment from 'moment'
import DatePickerWithFooter from './DatePickerWithFooter.vue'
export default {
  name: 'step3',
  components: { DatePickerWithFooter },
  created() {
    if (this.user) {
      this.updateFormValues(this.user)
    }
  },
  data() {
    return {
      form: this.$form.createForm(this),
    }
  },
  props: {
    canFix: {
      type: Boolean,
    },
    // 基本类型检查 (`null` 和 `undefined` 会通过任何类型验证)
    user: {
      type: Object,
    },
  },
  watch: {
    user: {
      handler: (newVal, oldVal) => {
        console.log(`guanli ${oldVal} to ${newVal}`)
        this.updateFormValues(newVal)
      },
    },
  },
  methods: {
    getInfo(v) {
      return axios.post('/register/subjectLegal/queryByInfo', { sysUserId: v.sysUserId }).then(r => {
        return r.result
      })
    },
    updateFormValues(r) {
      this.getInfo(r).then(newValues => {
        // 使用 Vue.set 或 this.$set 来更新 form 对象的属性
        this.form.setFieldsValue(newValues)
      })
    },
    validateForm() {
      return new Promise((resolve, reject) => {
        this.form.validateFields((err, values) => {
          if (!err) {
            resolve(values) // 验证通过，返回表单值
          } else {
            reject('表单验证失败') // 验证失败，返回错误信息
          }
        })
      })
    },
    moment,
    handleSubmit() {
      this.form.validateFields((err, values) => {
        if (!err) {
          console.log(values)
          // 提交表单数据
        }
      })
    },
    handleUpload(e) {
      const file = e.file
      if (file.status !== 'uploading') {
        console.log(file)
        const formData = new FormData()
        formData.append('file', file)
        axios
          .post('/sys/common/upload', formData, { headers: { 'Content-Type': 'multipart/form-data' } })
          .then(response => {
            console.log(response.data)
          })
          .catch(error => {
            console.error('上传失败', error)
          })
      }
    },
  },
}
</script>
